$(function() {
    initChartBar();
});
// 基于准备好的dom，初始化echarts实例
var barChart = echarts.init(document.getElementById('bar'));

function initChartBar() {
    nameList = [];
    valueList = [];
    //请求柱状图的数据
    $.ajax({
        cache : false,
        async : false,
        type : "POST",
        url : "/courseStuAmount/amount",
       //请求成功
        success : function(data) {
            if (data) {
                for (i = 0; i < data.length; i++) {
                    //X轴的数据
                    nameList.push(data[i].courseName);
                    //Y轴的数据
                    valueList.push(data[i].amount);
                }
            }
            if (data) {
                //绘制柱状图
                var optionBar = {
                    title : {
                        text : '学生选课统计表'
                    },
                    tooltip : {},
                    legend : {
                        data : [ '课程人数' ]
                    },
                    xAxis : {
                        data : nameList
                    },
                    yAxis : {},
                    series : [ {
                        name : '课程人数',
                        type : 'bar', //类型
                        data : valueList, //每个列的值
                        barWidth :40, //柱图宽度
                        itemStyle : {
                            normal : {
                                label : {
                                    show : true, // 开启显示
                                    position : 'top', // 在上方显示
                                    textStyle : { // 数值样式
                                        color : 'black',
                                        fontSize : 16
                                    }
                                }
                            }
                        }

                    } ]
                };
                barChart.clear();
                barChart.setOption(optionBar);
            }
        }
    });
}
